Typesetting & Usage 排版與應用
Scale 比例
排版比例是一組預設的字號間隔,用於控制排版系統中的字型大小。
就像音樂一樣,使用字型大小也要講究和諧。不是每種字號都要用,而是要選擇幾個互相搭配的大小。
大多數軟體的預設字號如下:
6, 7, 8, 9, 10, 11, 12, 14, 16, 18, 21, 24, 36, 48, 60, 72, 96實際上,字號間隔可以是任意值。不過,當各個字號之間的間隔有規律時,排版會更和諧。來看下面的例子:
Body font size = 1rem
Heading level 3 = 2rem
Heading level 2 = 4rem
Heading level 1 = 8rem和音樂一樣,我們也可以借鑑音樂中的和諧音程,用數學方法轉換成排版比例。想深入瞭解這方面內容的話,可以檢視這些線上計算工具:
Spencer Mortensen的排版比例文章和Jean-Lou的排版比例計算器。
Alignment & justification 對齊方式
在西文排版中,對齊是透過文字塊形成的看不見的垂直線來幫助閱讀。左對齊時,每行文字都從同一個位置開始。
右對齊讓文字的右邊形成一條直線;居中對齊就是讓文字在中間排列。如果文字的左邊和右邊都要對齊,這種方式叫做兩端對齊。
當使用兩端對齊時,文字之間會出現不自然的空隙,看起來像水流一樣。為了改善這個問題,我們可以把長詞分成兩半放在不同行。雖然兩端對齊讓版面看起來很規整,但它也有缺點:段落的最後一行通常不會對齊,這樣反而會讓整體看起來不夠美觀。
Typographer 字型設計師
閱讀Google Fonts Knowledge可以幫助你成為一名優秀的字型設計師。
字型設計師專門研究如何運用文字,精通排版藝術。需要注意的是,字型設計師不是創造字型的人——那是字型設計師的工作。
Typography 排版技術
排版技術就是調整文字外觀的方法。這和創造新字型是兩回事。
雖然選擇什麼字型不算是排版技術,但人們經常把它們放在一起談。排版包括調整文字的粗細、行間距和每行長度等。好的排版要做到兩點:第一是讓人容易看清楚文字內容,第二是讓文字傳達資訊的方式更有效。
Web font 網頁字型
網頁字型是一種特別的字型,跟電腦裡原本就有的字型不一樣。這些字型是專門為網站設計的。
從2009年開始,這種字型開始在網站上廣泛使用,因為那時的瀏覽器能更好地支援這項技術。
現在網站主要使用兩種字型格式:WOFF和WOFF2。這兩種格式的檔案比較小,所以很適合用在網站上。普通的字型格式(比如TTF和OTF)雖然也可以用,但檔案太大,而且可能會遇到版權問題。需要注意的是,WOFF格式的字型一般不能安裝在電腦上使用。
使用網頁字型有一個小缺點:因為需要下載字型檔案,所以可能會讓網頁載入得慢一些。用的字型越多,網頁就會越慢。不過現在有一種新技術叫"可變字型",能幫助解決這個問題。
Measure, or line length 行長
行長就是一行文字有多長。簡單說,就是從一行的開頭到結尾的距離。
好的行長設計能讓人更容易閱讀。太短的行會讓人眼睛跳來跳去,因為要經常換行;太長的行又會讓人看著看著找不到下一行在哪裡。當你設計比較長的行時,記得要把行與行之間的空間(行間距)加大一些,這樣讀起來會更舒服。
Baseline 基準線
基準線是字母底部對齊的看不見的線,用來測量行高和x字高的基準點。
基準線網格很簡單,就是一組看不見的橫線之間的距離。比如說,如果設定成16畫素的網格,就是每16個畫素有一條橫線。這些線可以幫助文字排列整齊。
Ascenders & descenders 上下延伸部分
上延部分是字母向上延伸的部分,比如小寫字母b和d的豎線。下延部分則是向下延伸的部分,比如小寫字母g和p的豎線。
上下延伸部分越長,字型的整體高度就越大,x-高度就相對越小。反過來說,如果一個字型的x-高度很高,那它的上下延伸部分通常會比較短。
檢查兩行文字之間的距離很簡單:看看上面那行字母向下的部分和下面那行字母向上的部分之間有沒有空隙。如果這些部分挨在一起了,就表示行距需要調大一些。
Hierarchy 層級結構
層級結構就是把文字內容按重要性排列。比如,我們用大標題和小標題來區分不同部分,讓重要的內容更顯眼。這就像我們在網頁中用大大小小的標題(h1、h2、h3等)來組織內容。
在做排版時,我們可以透過調整字型的大小、粗細等方式,讓這種層次感更加明顯。這樣讀者就能一眼看出哪些內容更重要。
Rhythm 韻律
韻律就是文字排版看起來有一種整齊和規律的感覺。這種感覺不僅可以在單個字的設計中看到,也能在整段文字的排版中體現出來。
我們可以透過很多簡單的方法來調整文字的韻律,比如調整字的間距、行與行之間的距離,或者調整一段文字的寬度。最常見的做法是把每一行之間的距離和段落之間的間隔設定得整齊劃一。用同樣的間距規則,整個文字看起來就會更加協調好看。
Drop cap 裝飾首字母
裝飾首字母是一種讓文章開頭更好看的方法,就是把第一個字母放大。這個設計方法最早是從古代抄寫聖經的時候開始的。
要用好裝飾首字母很簡單,只要記住兩點:第一,它要和文章其他部分看起來協調;第二,這個大字母通常要佔兩到五行文字的高度。